<template>
  <div>
    <p>
      <textarea v-model="state.commentText"></textarea>
    </p>
    <p>
      <button @click="addComment(userInfoStore.userInfo)">提交评论</button>
    </p>
  </div>
  <div>
    <ul>
      <comment-comp
        :data="state.commentTree"
        :user-info="userInfoStore.userInfo"
        @add-reply="addReply"
      ></comment-comp>
    </ul>
  </div>
</template>

<script setup>
import useUserInfoStore from '../store/user';
import CommentComp from './CommentComp';
import Comment from './Comment';

const userInfoStore = useUserInfoStore();
const { state, addReply, addComment } = new Comment('one');
</script>
